<template>
   <div>
     <div style="width: 1500px;height: 400px;background: cornflowerblue;margin-left: 60px" >
       <p style="color: white;margin-top: 20px;float: left;width: 1500px;font-size: 18px">最高额度(元)</p>
       <p style="color: white;width:1500px;font-size: 30px">{{product.amountMin}}</p>
       <p style="color: white;width:1500px;">年化利率 {{product.annualizedRate}}</p>
       <button style="width: 300px;height: 50px;border-radius: 20px;border: none;color: mediumblue;font-size: 18px;margin-top: 50px" @click="shen()">申请借款</button>
     </div>
<!--    规则-->
      <div style="width: 1500px;margin-left: 60px;">

         <div style="width: 500px;height: 1000px;margin-top: 20px;float: left">
        <div style="float: left;height: 50px;width: 500px;"><b>产品详情</b></div>
        <div style="width: 400px;border:2px solid greenyellow;border-radius: 25px;float: left;margin-right: 15px;margin-left: 55px">
          <p style="margin-top: 10px">申请条件<span style="margin-left: 50px;">{{product.conditions}}</span></p>
          <p>申请资料<span style="margin-left: 130px">{{product.material}}</span></p>
          <p>额度范围<span style="margin-left: 150px">{{product.amountRange}}</span></p>
          <p>年化利率<span style="margin-left: 140px">{{product.annualizedRate}}</span></p>
          <p v-if="product.ifShow==0">日利率计算公式<span style="margin-left: 50px">日利率=年化利率/360</span></p>
          <p>期限范围<span style="margin-left: 200px">{{product.termRange}}</span></p>
        </div>
         </div>

        <div style="width: 500px;height: 1000px;margin-top: 20px;float: left">
          <div style="float: left;height: 50px;width: 500px;"><b>申请流程</b></div>
          <div style="width: 400px;border:2px solid greenyellow;border-radius: 25px;float: left;margin-left: 35px">
         <img :src="logo" width="350px" height="230px">
          </div>
        </div>

        <div style="width: 500px;height: 1000px;margin-top: 20px;float: left">
          <div style="float: left;height: 50px;width: 500px;"><b>还款规则</b></div>
          <div style="width: 500px;border:2px solid greenyellow;border-radius: 25px;float: left;margin-left: 20px">
            <p style="color: deeppink">还款方式</p>
            <p>{{product.repayment}}</p>
            <p style="color: deeppink">预期费用</p>
            <p>{{product.lateFee}}</p>
          </div>
        </div>

      </div>





   </div>
</template>

<script>
export default {
  data() {
    return {
      product:{
        productId: this.$route.query.productId
      },
       logo: require('@/assets/333.png')
    }
  },
  created() {
   this.list()
  },
  methods: {

    list(){
<<<<<<< HEAD
       this.$http.get("/backstage/product/getByPid?productId="+this.product.productId).then( res=>{
=======
       this.$http.get("/product/getByPid?productId="+this.product.productId).then( res=>{
>>>>>>> b9a901b1fcebacba5607c234b0fee720966ba010
         console.log(res.data)
         this.product=res.data.data
       })
    },
    shen(){
      this.$router.push({
        path:"/ShenQing",
        query:{
          productId:this.product.productId
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
